<template>
	<div class="opt">
		<div class="name">{{prop.name}}</div>
		<button class="button" @click="jump">进入学习</button>
	</div>
</template>

<script setup lang="ts">
	const prop = defineProps({
		name:{
			type:String,
			default:''
		}
	})
	
	function jump(){
		uni.navigateTo({
			url:`/pages/enhance/enhance?name=${prop.name}`
		})
		console.log(prop.name)
	}
</script>

<style scoped>
	.opt{
	    width: 75vw;
	    height: 12vh;
	    display: flex;
	    justify-content: center;
	    gap: 10vw 10vw;
	    align-items: center;
	    margin-top: 30px;
	    background-color: white;
	    border-radius: 10px;
	
	}
	.button{
	    margin-left: auto;
	    margin-right: 30px;
	}
	.name{
	    margin-left: 30px;
	    font-size: 21px;
	}
</style>